<div class="modal hide fade" id="filterModal">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
    <h3 id="filterHeader">Filter Hosts</h3>
  </div>
  <div class="modal-body" id="filterBody">
    {{=LOAD('hosts','filter.load',ajax=False)}}
  </div>
  <div class="modal-footer">
    <button class="btn" data-dismiss="modal">Close</button>
    <button id="btnFilterClear" class="btn btn-info">Clear Filter</button>
    <button id="btnFilterSubmit" class="btn btn-primary">Submit</button>
  </div>
</div>

<script>
/*******************************************************
 * Host filtering javascript support
 *******************************************************/

function do_hostfilter(wait) {
    /* polls the hosts/host_filter function for its result
       and stores the result into the hostfilter variable
     */
     jQuery.ajax({
        url: "{{=URL('hosts', 'filter.json')}}",
        datatype: 'json',
        async: wait,
        success: function(data) {
            var hostfilter = JSON.parse(data['hostfilter']);
            var replacetext = "OFF";

            if (hostfilter['filtertype'])
                replacetext = hostfilter['filtertype'] + '/' + hostfilter['content'];

            var showall = new Array();
            var showtext;
            if (hostfilter['unconfirmed']) {
                //showall.push('<i class="icon-check"></i>');
                showall.push('U');
            }
            if (hostfilter['accessed']) {
                showall.push('<i class="icon-heart"></i>');
                //showall.push('A');
            }
            if (hostfilter['followup']) {
                showall.push('<i class="icon-flag"></i>');
                //showall.push('F');
            }
            if (showall.length == 0) {
                showtext = "All";
                if (replacetext.length == 0)
                    replacetext = "OFF";
            } else {
                showtext = showall.join("+");
            }

            replacetext = replacetext + "/["+showtext+"]";
            jQuery('#filter_hosts').html('<i class="icon-filter"></i> Filter: ' + replacetext).css('color', 'red');

            return true;
        },
        error: function(data) {
            return false;
        },
     });
};

jQuery(document).ready(function() {

    var hostfilter;
    do_hostfilter(false);
    jQuery("#btnFilterClear").on("click", function() {
        var url = '{{=URL("hosts", "filter.json", vars = {"function": "clear"})}}'
        $.web2py.ajax_page( 'GET', url, '', 'undefined' );
        jQuery('#filter_hosts').text(' Filter: OFF/[All]').css('color', 'black');
        jQuery("#filterModal").modal('hide');
    });

    jQuery("#btnFilterSubmit").on("click", function() {
        var data = jQuery('#host_filter_form').serialize();
        var url = '{{=URL("hosts", "filter.json", vars = {"function": "set"})}}';
        $.web2py.ajax_page( 'POST', url, data, 'undefined' );
        do_hostfilter(true);
        jQuery("#filterModal").modal('hide');
        /* XXX: This is never defined/used.
        if ($refreshpage) {
            location.reload();
        }*/
    });

} );

</script>
